<template>
  <uni-icons :type="icontype" :size="size" :color="color"> </uni-icons>
</template>

<script>
export default {
  name: 'fileIcon',
  props: {
    filename: {
      type: String,
      default: '',
    },
    size: {
      type: Number,
      default: 50,
    },
    color: {
      type: String,
      default: '#ccc',
    },
  },
  watch: {
    filename: {
      handler(newVal) {
        const type = newVal.split('.').pop().toLowerCase(); // 确保小写
        console.log('type --- 1', type);
        if (['jpg', 'jpeg', 'gif', 'png'].includes(type)) {
          this.icontype = 'image';
        } else if (['mp3', 'wav'].includes(type)) {
          this.icontype = 'mic';
        } else if (['mp4', 'avi'].includes(type)) {
          this.icontype = 'videocam';
        } else {
          this.icontype = 'folder-add';
        }
      },
      immediate: true, // 立即执行一次以初始化
    },
  },
  data() {
    return {
      icontype: 'folder-add',
    };
  },
};
</script>

<style></style>
